<template>
  <el-collapse v-model="activeName" accordion>
    <WifiConfig />
    <ServerConfig />
    <BatConfig />
    <AFEConfig />
    <OTAConfig />
  </el-collapse>
  <div v-if="!activeName">
    <h3>固件信息</h3>
    <el-descriptions :column="1" border style="padding: 10px">
      <ElDescriptionsItem label="当前版本" label-width="100px">
        V {{ infos.version }}
      </ElDescriptionsItem>
      <ElDescriptionsItem label="API版本">V {{ infos.api_version }}</ElDescriptionsItem>
      <ElDescriptionsItem label="芯片">{{
        infos.chip?.toUpperCase()
      }}</ElDescriptionsItem>
      <ElDescriptionsItem label="FLASH">{{ sizeFormat(infos.flash) }}</ElDescriptionsItem>
      <ElDescriptionsItem label="RAM">{{ sizeFormat(infos.ram) }}</ElDescriptionsItem>
      <ElDescriptionsItem v-if="infos.psram" label="PSRAM">{{ sizeFormat(infos.psram) }}</ElDescriptionsItem>
      <ElDescriptionsItem label="MAC">{{ infos.mac?.toUpperCase() }}</ElDescriptionsItem>
      <ElDescriptionsItem label="编译时间">{{ infos.time }}</ElDescriptionsItem>
    </el-descriptions>
  </div>
  <el-popconfirm
    v-if="!activeName"
    title="请确认是否重启"
    confirm-button-text="确认"
    cancel-button-text="取消"
    @confirm="reboot"
  >
    <template #reference>
      <el-button
        type="danger"
        style="width: 90%; margin: 10px"
        :loading="server_api.ticks?.reboot > 0"
      >
        重启
      </el-button>
    </template>
  </el-popconfirm>
</template>
<script setup lang="ts">
import store from "~/utils/store";
import WifiConfig from "./WifiConfig.vue";
import BatConfig from "./bat.vue";
import AFEConfig from "./afe.vue";
import ServerConfig from "./server.vue";
import OTAConfig from "./ota.vue";
import type { ChipInfo } from "~/utils/server_api";
import server_api from "../../utils/server_api";
const config = toRef(store);
const activeName = ref();
const infos: ChipInfo = computed(() => {
  return config.value.server?.chip || {};
});

function sizeFormat(size: number) {
  if (size < 1024) {
    return size + " B";
  } else if (size < 1024 * 1024) {
    return (size / 1024).toFixed(2) + " KB";
  } else if (size < 1024 * 1024 * 1024) {
    return (size / 1024 / 1024).toFixed(2) + " MB";
  } else {
    return (size / 1024 / 1024 / 1024).toFixed(2) + " GB";
  }
}

const reboot = () => {
  server_api.reboot();
};
</script>
<style scoped></style>
